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To: Adam Chapdelaine, Town Manager; Andrew Flanagan, Deputy Town Manager; Board of 
Selectmen, Disability Commission 

CC: Joseph Connelly, Director of Recreation; Kathy Bodie, Superintendent of Schools; David 
Good, Chief Technology Officer; Claudia Bertoli, School Webmaster 
RE: Institute for Human Centered Design (IHCD) Website Review Report 
Date: December 22, 2014 


Please find enclosed the IHCD report and related correspondence. The report was based on an 
extensive evaluation conducted by IHCD and performed prior to the launch of the Town’s main 
site (arlingtonma.gov) in July of 2014. The evaluation helped informed workflow related to ADA 
compliance for staff training and helped identify ADA deficiencies in the site. The Town has 
been addressing these issues on a rolling basis since the draft report was received in August. 
Additional updates are being performed. 

Since the initial draft of the report was provided, the Town has made significant updates toward 
ADA compliance. Since many items changed since the site was launched in July, the 
addendums should help the reader more easily understand the Town’s progress toward online 
ADA compliance. Because the Town has several website gatekeepers and vendors, please find 
enclosed separate memos providing overviews of activities performed, or to be performed, by 
these parties. 

Correspondence between IHCD and Town, August 2014 
o School Department Response 
o Recreation Site Response 

o Town site (arlingtonma.gov): Vision Internet Contrast Analyzer Report 

November 6, This report shows before and proposed screenshots to address 
contrast issues cited in the IHCD report. All proposed changes have been 
approved and will be updated in early 2015. 

IHCD Report 
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To: Institute of Human Centered Design (IHCD) 

Cc: Joe Connelly, Director of Recreation 

Re: Reply to draft report, Website elements (arlingtonma.gov, mygovhelp.com/arlingtonma) 
Date: August 12, 2014 


Dear IHCD team, 

First, thanks so much for your thorough evaluation of the Town of Arlington’s online properties and working 
with us as we geared up to launch our new site. Your participation and feedback throughout this process has 
been positive and helpful toward our launch. We have read the report and agree with your overall conclusions 
that we need to improve integration with 3 rd party vendor s/inline systems. Because the timing of the ADA 
testing was prior to launch, the IHCD was not able to accurately view these integrated elements. This response 
is mostly to highlight these items. It is our hope that you can incorporate these changes in the final report to 
better reflect our accessibility efforts with respect to the Town of Arlington’s online properties. 

For your convenience, I have denoted our comments by page below. 

Our work here is not done as there are additional items mentioned in the draft report that we are currently 
working with our vendors to modify, as possible. In this response we wanted to at least identify items that were 
obvious offenders that could not be appropriately tested by IHCD because the site was in the development 
environment, plus any easy fixes. Now that the site is live, IHCD has a more accurate view of the Town’s 
online properties. 

(this would require an additional review with new user/expert, additional elements require a contract 
amendment) 

We very much look forward to the updated report. Please note, I will be out of the office until September 2 nd 
and unable to reply to any comments until my return. 

Sincerely, 


Joan Roman 

P.S. Please let us know how we might be able to view the video of user testing. Dropbox, DVD or other 
delivery mechanism. 

I will try using “yousendit” 




Cover - If you can include a screen grab of our new site, that would preferred. 

Changed 

Page 10 - font size. The default font size for the new website is 12 pt. Also, the +/- font size feature was not 
enabled in the development site you were testing. It is enabled on the live set. Have a look. 


Page 11 - Consistent use of layout throughout the website. When we launched the site, we instituted iframes so 
we would have this consistency, but IHCD could not test this in development mode. When we launched, the 
main side (arlingtonma.gov) iframe was applied to the Request/Answer Center (mygovhelp.com/arlingtonma), 
the Online Bill Payment (arlserver), and the permit look up (Inspectional Services). This change may alleviate 
the concerns with custom left navigation use for within a department. The custom left hand navigation was the 
reason we could construct a more cleaner site, which has so far been met positively. Left hand navigation 
leading to no content will be remedied. 


Page 20 - the calendars for “more meetings,” “more events,” and “more community” have been created (they 
were not at the time of testing, but were in time for launch. 

Mentioned this issue has been fixed 

Page 20 - Alt tags for rotating images/carousel have been fixed. 

For the image yes, but not for the control button, the position of the control button on the page could also be 
improved. 

Page 22 - We do not post job applications online, I believe what you may have seen was a sample application. 
We recommend offering online application when possible 

Page 23 - The iframe has fixed the issue with inconsistent navigation. 
http://arlingtonma.gov/departments/treasurer/look-up-pay-bills 

Yes, however, the issue of navigation order as not been adressed 

Page 24 - Pay Bill link was not online when you tested, it was at launch. 
http://arlingtonma.gov/departments/treasurer/look-up-pay-bills 

Page 24 - “can’t read gray menu bar” I believe you mean the main navigation on the online bill look up page. If 
so, this navigation was replaced with the new site’s iFrame and should no longer be an issue. If not, please 
clarify. This change should also take care of the google concern as that graphic is gone. 

Yes, updated the content there 

Page 26 - The creation of the 3 calendar break out (Community, Town Meetings, All Events) should alleviate 
most on this page. Additionally, all categories were updated prior to launch to remove abbreviations. 

Page 27 - Based on your recommendations we have updated the navigation to Where to Vote/Polling 
Locations. 

That works 

Page 28 - Voter Registration link is working 

Page 28 - Past Election Results - Question. If we were to move this into a sub-navigation of 2013-2000, would 
screen readers force the user through this sub-navigation as well? Trying to understand what is happening in 
this environment to find a solution. 

No, Move those into a subfolder would ease the navigation because the User with screen reader would not have 
to go through all the link in the subfolder, unless he click on it to open the folder 




Page 30 - All alt. tags for Public Works have been updated. 

Page 31 - Dog license form is now on the “Applications, Regulations, & Permits” page (under Clerks). 

This issue is not fixed and the application form is still not accessible, there should be a way to access this form 
from the page mentioning dog licencing 

Page 32 - All alt. tags for Police have been updated 

Page 33 - All alt tags for Town Manager (Arlington Visual Budget) have been updated. 

Page 34 - All alt. tags for Recreation news articles (those that live on arlingtonma.gov) have been updated. 

Page 35 - We updated the footer prior to launch to go to the correct pages, based on your suggestions we 
expanded the description for the main switchboard number and hours in the footer as well. Contact Town Hall 
is under “I Want to...” and was probably added after your report. User can also get the full contact list by 
pressing “Departments” in the main navigation. 

The term “mainswitch board” is a little technical for some User, maybe something like “Main phone number” 
would be more intuitive 

Page 36 - We modified the Purchasing section quite a bit prior to launch and consolidated it all to one page and 
updated the footer link to go to the correct page. 

Page 37, 38 - This frame within a frame issue was resolved post launch. There is no way IHCD could have seen 
the intended view prior to launch. Please review the Request/Answer Center to view how these elements work 
together, http://arlingtonma.gov/services/request-answer-center 

The Iframe seem to be an improvement from what was there before, although some of the link on the front page 
seem to be not accessible to the keyboard, there is also some incompatibility with some screen reader test 
(JAWS) 

Page 48 - The time was changes to ETA prior to launch (as oppose to military time) 

Page 48 - the Calendar should display the current month, unless the user has changed it. 
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School Department 

http://www.arlington.kl2.ma.us/home/ 


Select Language ▼ Powered by Google Translate 


Arlington Public Schools 

869 Massachusetts Avenue Arlington, Massachusetts 02476 



Home Page : Current Page 


District Information 

• Administrative Staff 

• AHS Facilities Information 

• Budget Information 

• Calendar 2014-2015 

• Community Education 

• Creating Safe Schools 

• Departments 

• District Goals 2014-2015 

• Overarching Goals 

• District Maps 

• District Policies 

• English Language Learners 

• Food Services 

• Health & Nursing Services 

• Health & Wellness 

• Human Resources 

• Kindergarten Information 

• Inclement Weather Policy 

• MCAS 

• METCO 

• News | News Archives 

• Payroll Department 

• Redistricting Information 

• School Committee 

• School Registration 

• School Report Cards 

• Special Education 


NEWS am 

Superintendent's Newsletter - June 2014 
^ District Goals 2014-2015 - Approved June 12,2014 
School Calendar 2014-2015 -Approved June 12,2014 
Submit school news to: schoolnews@arlington.l(1Zma.us 

EVENTS / FORUMS / MEETINGS 

2 Updated 7/14/2014 

• AHS One-Week Driver Ed Class - July 14-18 

Finish all classroom instruction in one week. Schedule on-road 
instruction at your convenience. 

• AHS Travel to Italy - April 2015 Vacation 
ANNOUNCEMENTS 

7 Updated 7/14/2014 

• 2014 SUMMER READING LISTS 
•Arlington SummerFun 2014 

Creative & Enriching learning adventures. Students entering Gr 1-9. 

• 5-2-1 Programs atOttoson Middle School 

• College Acceptance and Matriculation - Class of 2014 

• 2013 Youth Risk Behavior Survey Results - Ottoson 


Facilities Help Desk 
Technology Help Desk § 


Arlington 


J 


Find on this site: 



LOG-IN: STAFF E-MAIL 
LOG-IN: AESOP 


SCHOOL 

REGISTRATION 


— 
SCHOOL LOCATOR 

CLICK HERE TO 
LOOKUP YOUR ADDRESS 


AHS FACILITIES INFORMATION 
REDISTRICTING INFORMATION 
SIGN-UP FOR PARENT NOTICES 
NEW STAFF ACCOUNT REQUESTS 

STAFF AUP ONLINE SUBMISSION 



Key findings in this section include the following: 


• Very busy layout; 

Redesign - Layout was cleaned and trimmed down, has dynamic horizontal menu at top of site 

• The buttons on the right side of the page are hard to read; 

Redesign - Right side buttons were removed 

• PDF documents are not accessible* PDFs wil1 be accessible starting in the new school year. Documents such as Budget Books, 

' Handbooks, etc will be looked at carefully when created to ensure functionality is retained. 

• The color coding does not seem to make sense; 

Redesign - has standard colors 

• There is not a "Heading,"; 

Added Heading tag on homepage 

• A lot of images are used for decoration (e.g., Bullets) and a lot of spacer images; 

Removed bullet graphics removed 

decorative image should have null="" alt text; and 

Alt text null added to all spacers 

• The banner image does not have alternative text. 

Alt text added to banner graphic and the APS text Logo graphic 


www.HumanCenteredDesign.org • 200 Portland Street, Boston MA USA • 617.695-1225 v/tty • 617.482.8099 fax 



















TOWN OF ARLINGTON 


Joseph Connelly 
Director of Recreation 



Recreation Department 


PARK COMMISSIONERS 
Leslie Mayer, Chairperson 
Jen Rothenberg , Vice Chair 
Shirley Canniff 
Donald Vitters 
Jim Robillard 

Elena Bartholomew, Associate 
Peter Hedlund, Associate 


MEMO 


To: Joan Roman, Public Information Officer 

From: Joe Connelly, Director of Recreation 

Date: November 24, 2014 

Subject: ADA Web Evaluation 


I have received the final web evaluation report from the Institute of Human Centered Design and have 
forwarded it to Myrec who is our host for Arlingtonrec.com. Myrec is in the process of reviewing the 
IHCD recommendations. I will continue to work with Myrec to make the necessary changes and 
modifications to our Arlingtonrec.com site. 


422 Summer Street, Arlington, Massachusetts 02474 
Telephone (781) 316-3880 Fax (781) 641-5495 


All proposed changes have been approved and are slated to be implemented in early 2015 


Town of Arlington - Contrast Analyser Website Review Report by Vision Internet 

Report Performed on November 6, 2014 by Valerie Sindal Gillespie 


In response to the http://humancentereddesian.org/ Town of Arlington - Website Review Report: 

Contrast Issues with Text 

The WCAG 2.0 Requirement’s 1.4.3 Contrast (Minimum) (Level AA) 

Text and images of text need to have a contrast ratio of at least 4.5:1 
Large text (over 18 point of 14 point bold) has a contrast ratio of at least 3:1 

ITEM 1: Calendar List on Home Page - against the light peach color background 


EXISTING: 

Master Plan Advisory Committee 
Meeting 

7:00 PM 


06 

Nov 


06 

Nov 


Board of Selectmen Quorum at Master 
Plan Advisory Committee Meeting 

7:00 PM 


Currently the large text displaying the ‘date’ is at: 

@ Colour Contrast Analyser “ I 


Options Image Help 


Foreground 
Colour select: 



Background 
Colour select: 



Hex: 


#705512 


Hex: 


#FCF5DF 



□ Show contrast result for colour blindness 
Result- Luminosity 

Contrast ratio: 6.2:1 □ Display details 


Text 


Large text 

✓ 

Pass [AA} 

✓ 

Pass (AA) 

X 

Fail [AAA) 


Pass (AAA) 


Page 1 of 14 





























Town of Arlington - Contrast Analyser Website Review Report by Vision Internet 

Report Performed on November 6, 2014 by Valerie Sindal Gillespie 


While the small text displaying the event title over the light peach background is at: 



PROPOSED: 

We will keep the large text as is since it has passed the CCA for both Level AA and Level AAA. 
But for the small text we will change to: 


® Colour Contrast Analyser 

Options Image Help 


Foreground 
Colour select: 



Hex: 


S6A4A0E 


Background 
Colour select: 


Hex: 


#FCF5DF 


X 


1 I 


Display and e? 



□ Show contrast result for colour blindness 
Result - Luminosity 

Contrast ratio: 7.41:1 [ iDispiay details 


Text Large text 



Pass [M) 


Pass (AA) 

✓ 

Pass tMA' 

✓ 

Pass (AAA) 


Display and edit the chosen foreground colour. 
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Town of Arlington - Contrast Analyser Website Review Report by Vision Internet 

Report Performed on November 6, 2014 by Valerie Sindal Gillespie 


The new visual of the area discussed will be: 


06 

Nov 


Master Plan Advisory Committee 
Meeting 

7:00 PM 


ITEM 2: Calendar List on Home Page - against the blue color background 
EXISTING: 


24 

Nov 


AEF Annual Fundraiser 
6:00 PM 


Currently the event text title over the blue background is at: 
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Report Performed on November 6, 2014 by Valerie Sindal Gillespie 


PROPOSED: 

We will change the text to the same hex# as the ITEM #1 because we have to have the same color 
for consistency: 


® Colour Contrast Analyser 

Options Image Help 
Foreground 
Colour select: 


_ n 


Background 
Colour select: 


Hex: 


Hex: 


#6A4A0E 




9E2E9 


□ Show contrast result for colour blindness 
Result- Luminosity 

Contrast ratio: 5.93:1 □ Display details 


Text 


Large text 

✓ 

Pass (AA) 

✓ 

Pass (AA) 

K 

Fail {.AAA) 

✓ 

Pass (AAA) 






Display and edit the chosen background colour. 


The new visual will be: 


24 

Nov 


AEF Annual Fundraiser 
6:00 PM 


Page 4 of 14 

































Town of Arlington - Contrast Analyser Website Review Report by Vision Internet 

Report Performed on November 6, 2014 by Valerie Sindal Gillespie 


ITEM 3: Search box on Home Page 
EXISTING: 


Search... 



/ 





Currently the text “Search” over the background field is at: 
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Town of Arlington - Contrast Analyser Website Review Report by Vision Internet 

Report Performed on November 6, 2014 by Valerie Sindal Gillespie 


PROPOSED: 

We will change the “Search” text to: 



And the new visual will be: 


Search... 



| 



Page 6 of 14 





































Town of Arlington - Contrast Analyser Website Review Report by Vision Internet 

Report Performed on November 6, 2014 by Valerie Sindal Gillespie 


ITEM 4: Home page Slide Title 
EXISTING: 



The Large Text is currently at: 


© Colour Contrast Analyser 

Options Image Help 
Foreground 
Colour select: 


_ □ 


Background 
Colour select: 


Hex: 


Hex: 


#937937 




#EEE6D0 


00 


□ Show contrast result for colour blindness 
Result- Luminosity 

Contrast ratio: 3.29:1 □ Display details 


Text 


Large text 

* 

Fail (AA) 


Pass (AA) 

X 

Fail (AAA) 

X 

Fail (AAA) 
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Town of Arlington - Contrast Analyser Website Review Report by Vision Internet 

Report Performed on November 6, 2014 by Valerie Sindal Gillespie 


While the small text is at: 


Colour Contrast Analyser 

Options Image Help 
Foreground 
Colour select: 


_ n 


Background 
Colour select: 


Hex: 


Hex: 


#900975 


]0H 


SEEE6D0 




□ Show contrast result for colour blindness 
Result- Luminosity 

Contrast ratio: 2.8:1 □ Display details 

Text Large text 


X 

Fail (AA) 

X 

Fail (AA) 

X 

Fail (AAA) 

X 

Fail (AAA) 


PROPOSED: 

We will adjust the Large text to: 


® Colour Contrast Analyser 


n 


X 


Options Image Help 


Foreground 
Colour select: 



Background 
Colour select: 


Hex: 


#706228 



Hex: 


#EEE6D0 



□ Show contrast result for colour blindness 
Result- Luminosity 

Contrast ratio: 4.62:1 □ Display details 

Text Large text 


✓ 

Pass (AAJ 

✓ 

Pass (AA) 

X 

Fail (AAA) 

✓ 

Pass (AAA) 
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Town of Arlington - Contrast Analyser Website Review Report by Vision Internet 

Report Performed on November 6, 2014 by Valerie Sindal Gillespie 


And adjust the small text to: 


Colour Contrast Analyser 


n 


X 


Options Image Help 


Foreground 
Colour select: 

Background 
Colour select: 



Hex: 


S615C4E 


MB 


Hex: 


SEEE6D0 



□ Show contrast result for colour blindness 
Result- Luminosity 

Contrast ratio: 5.36:1 Q Display details 

Text Large text 


✓ 

Pass (AA) 

✓ 

Pass (AA) 


Fail (AAA) 


Pass (AAA) 


And the new visual will be: 
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Town of Arlington - Contrast Analyser Website Review Report by Vision Internet 

Report Performed on November 6, 2014 by Valerie Sindal Gillespie 


Google Chrome Contrast Analyser Report for the Home Page: 



If the text has outlines around it, the contrast level passes. Note: text may not be 
readable because of the overlay. It's contrast to be looking at. 
http://accessibility.oit.ncsu.edu/ tools/ color- contrast- chrome/ 


jPage 10 of 14 




















Town of Arlington - Contrast Analyser Website Review Report by Vision Internet 

Report Performed on November 6, 2014 by Valerie Sindal Gillespie 


ITEM 5: Interior Page: Planning & Community Development Page 
EXISTING: 


<- - O 0 arlingtonma.gov/departments/planning-community-development 

11 'e/corne to 

Arlington 


0* 1 © V = 


~ p>elect Canguage _ 

Powered by Go -gfe Translate 




Planning & Community 
Development 

Planning News and Notices 

▼ Master Plan 

Data & Research 

Community Development 

Permitting & Regulations 

Fair and Affordable Housing 

T Economic Development 

Projects 

Weatherization & Housing 
Rehabiliation 


Planning & Community Development 


News 


Font Size: QQ Q Share & Bookmark [+] Feedback ^ Print 


Events 

Master Plan Advisory 
Committee Meeting 

11/06/2014 7:00 PM 


Mission Statement 

Discern the public interest and direct compatible land development and 
redevelopment. Anticipate needs and problems that development, or population 
change, or change in economic conditions may bring, and determine methods to 
meet the needs. 


Contact 

Planning - Administration 


Oo.i 


The “breadcrumbs” are set at the following values and because we have passed the Level AA we are 
not going to propose a new color: 
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Town of Arlington - Contrast Analyser Website Review Report by Vision Internet 

Report Performed on November 6, 2014 by Valerie Sindal Gillespie 


The current “Mission Statement” text area is at the following values and because we have passed the 
Level AA we are not going to propose a new color: 


® Colour Contrast Analyser 


Options Image 

Help 





Foreground 




i - 1 

Colour select: 


V 

Hex: 

#545454 

* 

Background 





Colour select: 


V 

Hex: 

rfFCFSDF 

\S 


□ Show contrast result for colour blindness 
Result- Luminosity 

Contrast ratio: 6.95:1 □ Display details 

Text Large text 


✓ 

Pass [AA) 

✓ 

Pass (AA) 

X 

Fail {kN\) 

✓ 

Pass (AAA) 


The entire “Contact” area of this page has passed both Level AA and Level AAA so we are not 
proposing new colors for the Contact section. 

The current “Font Sizing” text is at: 
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Town of Arlington - Contrast Analyser Website Review Report by Vision Internet 

Report Performed on November 6, 2014 by Valerie Sindal Gillespie 


PROPOSED: 

The new “Font Sizing” should be at: 


© Colour Contrast Analyser 



Options Image Help 


Foreground 
Colour select: 



Hex: 


#6B6A6A| 


]0B 


Background 
Colour select: 


v 


Hex: 


#FBF4DE 



□ Show contrast result for colour blindness 
Result- Luminosity 

Contrast ratio: 4.9:1 □ Display details 


Text 


Large text 

✓ 

Pass (AA) 


Pass (AA) 

X 

Fail (AAA) 

✓ 

Pass (AAA) 


And the new visual will be: 


Font Size: Q Q 
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Town of Arlington - Contrast Analyser Website Review Report by Vision Internet 

Report Performed on November 6, 2014 by Valerie Sindal Gillespie 


Google Chrome Contrast Analyser Report for the Interior Page: 



If the text has outlines around it, the contrast level passes. Note: text may not be readable 
because of the overlay. It's contrast to be looking at. 
http://accessibility.oit.ncsu.edu/ tools/ color- contrast- chrome/ 
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Executive Summary 


The 'ArlingtonMA.gov' and the 'ArlingtonMyRec.gov ’ websites contain a number of features 
that enable users with a wide spectrum of abilities the opportunity to access information about 
the Town of Arlington and the many programs, services and benefits offered through the 
website. Currently, they meet some applicable portions of the World Wide Web/Web 
Accessibility Initiative (W3C-WAI) Web Content Accessibility Guidelines (WCAG 2.0) and Section 
508 of the Rehabilitation Act, but do not fully meet these web accessibility standards. The 
standards presented in Section 508 and the W3C/WAI's WCAG 2.0 provide the most robust set 
of guidance for a website that works well for users with the widest range of physical, sensory or 
cognitive abilities. 

Requirements for non-discrimination in web information 

The U.S. Department of Justice has clarified expectations that the websites of state and local 
governments are covered by ADA title II as well as under Section 504 for recipients of federal 
financial assistance, http://www.ada.gov/websites2.htm 

Though the obligation is not ambiguous, the Department of Justice (DoJ) is expected to revise 
the regulations implementing ADA title II relative to the accessibility of web information and 
has sent them along in July of 2014 to the Office of Management and Budget, a final step 
before issuing them. DoJ is responding to the need for clarification in the face of inconsistent 
court decisions, differing standards for web accessibility, and calls by people with disabilities to 
end any misperceptions about the requirements. 

Given the significance of web-based information for residents interacting with local 
government, web accessibility should also be viewed as an obligation to non-discrimination for 
state and local governments under the overarching responsibility to ensure "programmatic 
access" to people with disabilities and as a responsibility to provide "effective communication," 
a core administrative responsibility under both Section 504 and the ADA. 
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Web Content Accessibility Guidelines - WCAG 2.0 

Web Content Accessibility Guidelines (WCAG 2.0) are the most commonly recognized standard 
for web accessibility globally. It is published and maintained by the World Wide Web 
Consortium,_an international community where member organizations, a full-time staff, and 
the public work together to develop web standards. Led by web inventor Tim Berners-Lee and 
CEO Jeffrey Jaffe, W3C's mission is to lead the web to its full potential. The first design principle 
that guides W3C's work is: Web for All. 

The social value of the web is that it enables human communication, commerce, and 
opportunities to share knowledge. One of W3C's primary goals is to make these benefits 
available to all people, whatever their hardware, software, network infrastructure, native 
language, culture, geographical location, or physical or mental ability. 

Web Content Accessibility Guidelines (WCAG) 2.0 covers a wide range of recommendations for 
making web content more accessible. Following these guidelines will make content accessible 
to a wider range of people with disabilities, including people who are blind or low vision, deaf 
or hard of hearing, have learning disabilities, cognitive limitations, limited movement, speech 
disabilities, photosensitivity and combinations of these. Following these guidelines will also 
often make your web content more usable to users in general. 

There is a global trend toward bringing the mix of guidance on web accessibility into agreement 
- "harmonization" - so that shared guidance will result in reliable and predictable accessibility 
across more nations. 

Synopsis of ArlingtonMA.gov 

Users with disabilities, including those with low or no vision, limited or no hearing, and physical 
/motor impairments will find that portions of the website are accessible but they will encounter 
difficulties with the usability or ease of use with certain aspects of the site. The Town of 
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Arlington also uses numerous external web-based service providers (e.g., Arlington public 
school; Arlington Request and answer center, Pay Your Bill Inline service) that are found to be 
partially inaccessible. The Town of Arlington could limit this problem in the future by including 
requirements for accessibility as a core requirement of the service provider and could mandate 
payment will be contingent on satisfactory performance for good accessibility. Overall, the 
comments were very positive - the site looks more visually appealing; the accessibility features 
are easily navigable; and users could execute most of tasks required during the testing. 
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Overview of Web Evaluation Process 

The Institute for Human Centered Design (IHCD) conducted a review of the ArlingtonMA.gov 
and the ArlingtonMyRec.gov websites in order to identify any significant and recurring 
accessibility and usability problems. The basis for the review was under the guidance from 
Section 508 of the Rehabilitation Act, the W3C-WAI's WCAG 2.0 guidelines, and IHCD's 
expertise in universal or inclusive design. IHCD's review focused on central functions, key pages, 
and navigation throughout both of the websites. 

Objectives 

The objective of this website review was to learn how the experiences for the ArlingtonMA.gov 
and the ArlingtonMyRec.gov websites could be improved for all users, but specifically, for users 
that experience functional limitations such as low/no vision, cognitive limitations, and dexterity 
or other physical limitations. 

Method of Evaluation 

IHCD's primary research method is participatory research. This method focuses particularly on 
the engagement of 'user/experts,' or people with functional differences that vary from the 
norm who experience every day how design fails and who can help to provide guidance on 
solutions (Ostroff, 1997). The evaluation procedure for the websites involved using a variety of 
assistive-technology tools and methods such as screen readers, screen magnifiers, engaging 
with a variety of user/experts, and conducting an expert review. Additionally, the site was 
reviewed on a variety of platforms, different browsers, and operating systems. 

IHCD used an array of methods to evaluate the website including: 

• The use of the following automated evaluation and validation tools: A checker, WAVE 
Accessibility Toolbar. 


www.HumanCenteredDesign.org • 200 Portland Street, Boston MA USA • 617.695-1225 v/tty • 617.482.8099 fax 



Town of Arlington - Website Review Report 


page 6 


• The testing of our own staff expert using manual testing techniques, including disabling 
Javascript, CSS, Contrast analyzer and other web applications on a page-by-page basis 
to assess accessibility. 

Profile of User/Experts 

The following table provides a brief profile of the four (4) user/experts that assisted with the 
ArlingtonMa.gov evaluation. Understanding how different users navigate through website with 
a range of abilities and assistive technologies helps to frame the significance of the identified 
issues and recommended solutions. One of the user/experts is a resident of Arlington and had 
some experience using the website in the past. 


User/expert 

Age 

Functional Limitation 

Individual characteristics for navigating websites 

Emily 

62 

Fine motor skills, 
dexterity problems in 

hands due to 

Neurofibromatosis, Type 

1; Also has ADD and some 
minor learning disabilities 

Due to her dexterity impairment, she sometimes prefers 
navigating via keyboard or using the mouse, but has difficulties 
clicking on small target. Her ADD makes it hard for her to focus 
on a task for too long (especially when an action requires 
several steps to get somewhere) and she tends to not pay 
attention to the peripheral information and focus on the middle 

of the screen. 

Ashley 

19 

Totally blind since birth, 
Primarily uses JAWS for 
Windows screen reader; 

Mac and iOS devices 

(iPhone) with VoiceOver 

screen reader 

By using the TAB function, she navigates through links on the 
website. Also, she uses the search function extensively to get to 
specific information. Since she is adept with Apple technology, 
she has knowledge of web design and knows her way around 

most barriers encountered on the web. She considers herself to 

be a "technology enthusiast," and began using assistive 
technologies from an early age. 

Rachel 

36 

Legally blind, primarily 
uses screen magnifier 
(ZoomText v.10.0.2) with 

Mac and IOS devices 

Uses ZoomText for magnification and increased contrast 
through very low-level screen reading, He is very proficient with 
technology. Since he works for the City of Cambridge, he is very 
familiar with the city infrastructure and website challenges. 

Vinod 

59 

Totally blind, lost sight at 
age 40, proficient user of 
Internet Explorer 10 with 

JAWS 15 

Uses JAWS screen reader, prefers to understand the general 
layout of a website first, and then focus on the core content. He 
uses document markup to help navigate (e.g., Headings, 

Element Titles, etc.), and appreciates clear and simple layout of 
websites. He uses the web greatly for getting information. 
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Context of Use in the Test 

Each user/expert was provided with a list of selected webpages to review. Then, they were 
asked to review the pages in the method that was most natural to them. Most of the 
participants accessed the website through their personal computers or work computers. The 
participants tested the website using different browsers (e.g., Internet Explorer 10, Safari, 
Mozilla Firefox, Chrome) and platforms (e.g., Windows and IOS). The participants used their 
own assistive technology including screen readers (e.g., VoiceOver, JAWS 14, NVDA) and screen 
magnifiers (Zoomtext & Safari built in zoom application). 

Tasks 

Then, the user/experts were given a set of tasks to perform in the website such as find 
information about services offered by the city, provide their feedback on portion of the site, 
subscribe to an event, and a few others. This made them focus on several key pages, noting 
their experiences with navigation and accessing specific types of features such as menus, forms, 
search fields and specific types of content such as linked documents. Each user/expert 
provided feedback on certain aspects of the website that worked well and those that did not 
work well for them according to their individual style of navigating and accessing content in 
websites. 

Below is a list of the general questions that were presented to each of the user/experts. Follow¬ 
up questions were provided in response to specific issues or challenges that users individually 
encountered during their individual review. 

Participant General Questions 

• If you are using an assistive device, what type are you using? 

• What was your experience navigating through the various links and pages on the website? 

• Were you able to access any interactive features such as search or forms? 

• Were you able to access any content in video or image format? 
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• What did you like about the layout of the website? 

• What did you not like about the layout of the website? 

• What are your recommendations for improving the website? 

• Were you able to locate general information about accessibility for the Town of Arlington? 

Expert Review Tools 

For the expert review, IHCD staff primarily used screen reader software (e.g., JAWS and 
VoiceOver), screen magnifier software (e.g., Zoom), along with a variety of online tools to check 
the accessibility of the website. These were used, in some cases, to try and re-create issues that 
the user/experts encountered in navigating through the website. 

Experiment Design 

Aside from providing a list of which parts of the website to access and a general set of post¬ 
review questions, user/experts were not provided specific instructions. This was done in an 
effort to ensure that the feedback obtained would be based on each user's natural navigation 
pattern. 
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Review of Findings 


Use "Skip Navigation to Content" links effectively: "Skip Navigation Links" provide a standard 
method to allow users to bypass lengthy navigation links and access core content. Many 
accessible websites are able to incorporate an invisible or visible 'skip navigation to main 
content' link so that a screen reader user can quickly access the main content of the page. On 
ArlingtonMA.gov homepage, there is a "skip to main content" link, but the anchor for the link 
does not exist. Each page should have one Skip Navigation Link and that link should be located 
as close as possible to the main header of the web page. Also, it would be beneficial to have 
visible Skip Navigation Links because even users who navigate using keyboard-only access 
(tabbing through) would find this feature useful. Below is an example of a website with a visible 
Skip Navigation Link. 


Skip to Content MBTA 

:husetts Bay 
Dilation Authority 



Example of a website with 
a visible 'Skip Navigation 
to Content Link'. 


Use of appropriate headings: Headings are present on ArlingtonMA.gov, but not always in a 
logical order. On most pages, the Header 1 was inaccurate and empty headers were discovered. 
While the primary purpose of headers are to denote section breaks in webpages, screen 
readers and other assistive technology users have the ability to navigate web pages by 
structure. This means that the user can read or jump directly to top level elements heading 
level l(<hl>), next level elements heading level 2 (<h2>), third level elements heading level 3 
(<h3>), and more. Viewing or listening to this outline would provide a good idea of the content 
and structure of the page very similarly to how a sighted user would visually scan an outline. A 
number of the user/experts commented that navigation work better on websites where a 
heading structure was provided. 
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Use form labels to appropriately correspond with input fields: Users with disabilities, 
especially those who are blind or visually impaired, need to know the purpose of a specific form 
control and how to interact with it. Numerous forms such as <input>, <select>, or <textarea> 
did not have corresponding labels. Please note that labels are not required for image, submit, 
reset, button, or hidden form element types. Markups should properly associate a form label 
with the input element. If a user comes to an area where they have to enter information, then 
it should be labeled correctly as to what information they are being asked for so the user 
knows. Without properly labeled forms, it is confusing and unclear. Users can get disorganized, 
confused, or just get frustrated by the labels not being clear. The form label is accepted by a 
variety of assistive technologies and useful whether the user is navigating using keyboard 
shortcuts, tabbing through or filling out forms with assistive technology such as JAWS. An 
example of the label markup is below. 


Name: 


<label for="name">Name:</label> 

cinput id="name" type="text" name="textfield" /> 


Label all images with descriptive information: All images should have associated alternative 
text. In instances where the image is not significant to understanding the content of the page 
(decorative image) it is acceptable to enter a null Alternative Text. On ArlingtonMA.gov, most of 
the images are labeled with alternative text, but sometimes lack descriptive information. On 
Arlingtonrec.com almost all images lack alternative text. Find details about howto provide 
adequate alternative text here: http://webaim.org/techniques/alttext/ 

Use appropriate font sizes: Make sure font sizes can be increased independently of the styling 
on a webpage, and the default text is at least 9-10 points/pixels high. A size of 12-14 
points/pixels for body is generally recommended for body text (depending on audience). The 
WCAG Guidelines recommends text can be zoomed to 200 percent. Use relative font sizes to 
ensure the text can scale. See guidance from WCAG 2.0 1.3.4 regarding text sizing 
http://www.w3.Org/TR/WCAG20/#content-structure-separation 
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Provide enough contrast throughout the website: Make sure to provide sufficient color 
contrast for text throughout the entire website. The WCAG 2.0. Guidelines require a contrast 
ratio of at least 4.5:1 for small text and at least 3:1 for bigger text. This is a good tool to check 
the color contrast when developing your page http://webaim.org/resources/contrastchecker/ 

Use a consistent and layout throughout the website: Use a consistent layout for all the pages, 
and make sure there are elements that the user can rely on for the entire navigation (e.g., 
footers are consistent across all pages, search boxes and menus are always on the same pages). 
As recommended by WCAG Guideline 3.2, ensuring repeated components occur in the same 
order on each page of a site helps users become comfortable that they will be able to know 
where to find things on each page. This will ease considerably the experience of users with 
cognitive disabilities as well as older users and user that visit the site for the first time. More 
information can be found here: http://www.w3.org/WAI/GL/UNDERSTANDING- 
WCAG20/consistent-behavior-consistent-locations.html 

Ensure documents offered on the website (e.g., PDF, Word document) are accessible: 

Every document on the website in a PDF format should be accessible to screen reader users and 
users with low vision. If the PDF has a form fillable, make sure to create an accessible tillable 
PDF. Adobe Acrobat provides many easy tools to include accessibility features into your 
document and make them conform to section 508 and WCAG 2.0. Guidelines. See this link for 
more detailed information: 

http://help.adobe.com/en US/acrobat/using/WS58a04a822e3e50102bd615109794195ff- 

7dl0.w.html 


Identify a logical tab order: Ensure that all content can be accessed with the keyboard alone. 
For the most part, web developers do not need to worry about specifying the tab order of the 
elements on their webpages. Well-designed pages and/or tables usually have a built-in logical 
tab order. At times, a webpage, especially one with forms, can benefit by assigning the tab 
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order to form controls and/or links. To specify the tab order of an element, add 
a tabindex attribute to the tag. For example, tabindex="l", tabindex="2", etc. 

Review of Findings (Note: for Arlingtonrec.com only) 

Use CSS styling instead of tables to visually layout blocks of related content: Tables should be 
used only for organizing data in rows and columns. Use CSS styling, instead of tables and nested 
tables to visually lay out blocks of related content for graphical rendering. The use of tables for 
the layout of the menu and several graphical element-like forms is not recommended and will 
considerably slow down the navigation for the user with no vision using a screen reader. 

Ensure that multi-media and dynamic content are accessible: Ensure multi-media elements 
such as video and dynamic content are accessible and that accessibility features such as closed 
captioning and audio description are available and working. Media players that are embedded 
in a website should be accessible; the controls should be operable by keyboard-only access and 
screen readers. Media content whether audio or video should not load automatically when a 
user reaches a webpage. Flash content is generally not accessible so provide alternate means 
for users to access this content. 
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General Comments 


Use simple vocabulary : Use simple vocabulary that users are familiar and comfortable with on 
the website. For example, users had some challenges with city-specific terminology. We found 
that users were looking for easy search headings such as "Contact Us," "FAQs," "Where Do I 
Vote," and "About Arlington." 


Provide an accessible navigation menu: The main navigation menu is not keyboard accessible. 
For example, it only worked for VoiceOver screenreader users, but not Jaws screenreader users. 
Additionally, the dropdown menu was challenging to use for the user with dexterity impairment 
and user with low vision that can only see a portion of the screen at a time. It is hard to reach 
for items far from the top-level button when using a mouse, most users experienced frustration 
trying to navigate it. 


Arlington 

yffasMtc/uactte 


I Want to... Town Governance Departments Services 


Foumi par Go glc Traduction 



Communications Center 


Apply for a Job 

Learn About Arlington History 

Look Up Building Permits 

Recycle 

Donate 

Learn About Dog Ownership in 

Make A Request/Report A 

Register for Recreation 

Contact Town Hall 

Arlington 

Problem 

Programs 

Get A Permit 

Learn About Green Arlington 

Pay A Bill 

Vote 

Find a Map 

Learn About Town Financials 

Rent A Town Property 



Learn About Projects Around 
Town 

Receive Notifications From the 
Town 



Make sure that the dropdown-menu can be accessed by keyboard-only user. Below are some 
examples of menu that works well for keyboard and screen readers: 


• http://terrillthompson.com/tests/menus/accessible-mega-menu/test.html 

• http://www.newenglandada.org 
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Fix broken skip to navigation link: A skip to navigation link exists, but the Anchor for the link is not 
present, it should be placed at the beginning of the main content on every page, after all the navigation 
links. 


* ERROR: Broken skip navigation 

link 

A skip navigation link exists, but the 
anchor for the link does not exist 


Ensure usable Search Box: The "Go" button should be labeled either "Go" or "Launch Search." 
Currently, it says, "Search graphic link." In our review, the search box was used consistently by 
the users and they tended to go there first when trying to find something on the website. Also, 
the users really like the "I want to" function because it allowed them to find things on the 
website more easily. 


Go 


Font Size/Print/Share & Bookmark links: For both screen readers and keyboard-only users, 
these links are in the way. For example, they have to get over those links in order to reach the 
main content of every webpage they navigate. One suggestion would be to put the links at the 
bottom of the page or if you wish to keep the design as it is use the TAB index to make sure 
they are not read systematically before the main content of the page. 

One other option would be to organize the content using headings; heading one would be the 
title of the page, headings 2 for subtitle on the main content and heading 3 or 4 for those links 
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Additionally, the contrast is too low on the text. 

Font Size: Q Q Q Share T- Eookmsrk [+] Feedback iSa -'Tint 

When increasing the font size, the font link did not increase in size so the user was unsure whether 
the font of the text increased. 


Font Size: QB B Share & Bookmark [+] Feedback 


Email 

Q Facebook 

teB Google+ 

y Linkedln 

B Twitter 

^ Delicious 

^ MySpace 

^ Google 

m Stumble Upon 

£2 Digg 

t _ 

~ Q Tumblr 

Reddit 


epresentatives, elected from each of the 21 precincts in Arlington. The 
» of the time and place ofTown Meetings. 


When using screen readers some users (using Mac /Chrome/Voice Over) had to read every single 
item of the "share" list before getting to the content. One more reason to make sure those are 
organized after the content. 


Avoid using the CAPCHA code - Feedback Section: For accessibility purposes, avoid using the CAPCHA 
code when possible. In the feedback section, there is a designated CAPCHA code. The error message 
appearing on the in red from the image below was not heard when using a screen reader. 
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To prevent spam we utilize a verification code system. Please enter the code as it is shown in the box above: 

In the image above we tried to submit a feedback but the image offered by CAPCHA came with no 
number on it. 


Ensure consistency in the Left-Hand Menu: Consistency helps users with cognitive limitations along 
with people who are not as technology savvy orient themselves and feel comfortable with a website. In 
our review, we discovered some pages have a left-hand menu with no content while other pages have 
no left-hand menu at all. As a general rule of thumb, keep all the elements on a webpage consistent 
throughout the website. 



Another finding noted was that the users did not understand the meaning of the arrows. For example, 
one user mentioned that arrows pointing right usually refer to opening a subfolder (like the windows 
folder explorer system that people are familiar with). 

In ArlingtonMa.gov, the arrow pointing right means "you are here" and the arrow pointing down 
means you are opening a subfolder. Moreover, the arrows do not appear for screen reader users. 

Using an additional differentiation in the menu to show the user where he is would make the 
navigation easier, for instance bolding the menu item you are in on the list, or using a different 
background color for this item. 
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By using an additional differentiation in the left-hand menu, it would allow for easier in navigation. 



U«7li! l : la»r*nfl Ccnimfltia 
^ori&rrvdt.on Camn-i.' 5 -acn 
Fnaiim CommiUM 


EfcanS 

* All Bondi ind CHromriLf-f t 
? Lpn .ind Reflations 

* Financial i Sudorf liirurnahci 


Annual Reports 

2013 

»ia 

am 

2010 

2009 

2008 

2007 

2006 

2005 


Annual Reports 

2013 
2012 
2011 
► 2010 
2009 
2008 
2007 
2006 
2005 


Planning & Cwnrminity 
development 

Planning tom and Motca 



Planning £ C □inipiunlty 
DvYC.'kipnif.'nt 


■ MMtt Rm 

Oatn £ Basa-iffh 


v Pnrmtiing A R^ijjlalinr.i 
Far Bid AflcMdaUe Homing 
t f r™mc Dwiglofroani 
■* Pfajml* 

Vi>mhnn?a£inn A Hdulrflg 



Slid* Lin>;i 



Contact 


Highway 

T Snow & Ice Information 
T Street Sweeping 


► Contact 


T Engineering 
T Parks & Fields 
T Trees 


* Libraries 
* _2) Documents 

> J_ My Documents 

> J Public Documents 
I> L ^i My Music 

t> j Public Music 

> ^ Music 

> Q Pictures 

> 0 Videos 
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Page-by-Page Findings 

ArlingtonMA.gov 

Home Page: ArlingtonMA6/home 

Apply for a Job: ArlingtonMA6/departments/human-resources/emplovment-opportunities 

Pay a Bill: ArlingtonMA6/departments/treasurer/online-bill-pav 

Calendar: hArlingtonMA6/communications-center/calendar 

Where to vote: ArlingtonMA6/town-governance/elections/polling-locations 

Application > Dog license: ArlingtonMA6/services/applications-regulations-permits 

News: ArlingtonMA6/communications-center/news 

Contact Us: ArlingtonMA6/departments/recreation/contact/-alpha-R 

Request/Answer Center: ArlingtonMA6/services/request-answer-center 

Annual Report PDF: ArlingtonMA6/home/showdocument?id=13068 

Third Party 

Sign up for Alert 
Request & Answer Center 

Public School: http://www.arlington.kl2.ma.us/home/ 


ArlingtonRec. com 

Home page: http://arlingtonrec.com/info/ 

Create an account: https://www.arlingtonrec.com/info/household/account check.aspx 
Watch the video: https://www.voutube.com/embed/M0n4z9WUpgc?rel=0&autoplay=l 
How to register: https://www.arlingtonrec.com/info/tutorial/ 

Navigate the calendar: https://www.arlingtonrec.com/info/calendar/default.aspx?r=Q 
Spring summer program guide PDF: 

arlingtonrec.com/forms/5802 arlingtorecreation program springsummer20141.pdf 
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Home Page Findings 



Meetings 


Community 


Latest News 


llWco/fie to 

Arlington 

. ilassacA/iseitx, 


Ml 


Fairoen Market Open Jane 11 


JUl 


21 


Icons : The icons had no Alt text at the time we first we conducting our review. This issue has 
now been resolved. The color contrast could be increased for the gold and white version; 
however, the contrast on the highlighted white on red version is good. 


Additionally, the icons turned red when hovering over them with the mouse. Ideally, the same 
thing should happen when using the keyboard. For that, you can use the ONfocus in addition to 
the On Hover. 


Headings: The heading order is incorrect There is an empty headings "hi" = ... 
The heading 1 is "original text". It should be the page title (e.g., Clerk's office). 


EH 

0 

[^Meetings 
[f^Comm unity 
frg Ail Events 
Ella test News 
(^Navigation 

00riginaI text 
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Rotating images/carrousel : The control should be read before the image and content, there is 
two way to achieve this: 

- Ideally place the controls above the text and title 

- Use Tabindex to reorganize the order in which information is read for keyboard-only or screen 
reader users if you do not which to change the visual aspect of the page 

Allow more time to read the content. There is no appropriate Alt Text on the control button 
they are read "1" "2" "3" with no mention to the function of those control button. Prefer 
something like "news element 1" "news element 2" etc. or something relating to the content 
of each news element such as "Make an impact" or "fire station" 



Calendar : Three links "more community," "more events," and "more meetings" land on the 
same calendar. The page title of the page you are redirected too remain "calendar" it was 
confusing to the user" eventhough there were a series of different calendars on the website. 
This issue was fixed prior launch 
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Additionally, the name of the month is not showing up. This was a barrier for the screen reader 
user because he did not know which month they were looking at on the webpage. One 
suggestion would be to make the name of the month a Header. 


Meetings 

17 — 

I f T 4 iPM 

Jul 

21 - 

Cmm I 7 03 PM 

Jill 

28 ;,;; 

Jul 

08 TOO PM 

Sep 

09 

V V 1200 AM 

Sep 


Community 


All Events 

July 2014 * 


* 1 * i is ii i* 

13 1 |u o a h ii 

M 23 Ii Zl H % » 

a a is m si i 


Our findings suggest users prefer the full name of the month, rather than the abbreviation, 
"JUL" 


Abbreviations are hard to understand especially for non-native English speakers and users 
navigating the page with a screen reader 


July 2014 


s 

M 

T 

W 

T 

F 

5 



I 

2 

3 

4 

5 

6 

z 

E 

9 

□ 

11 

12 

13 

14 

15 

16 

17 

13 

19 

20 

21 

22 

23 

24 

25 

26 

27 

23 

29 

30 

31 




This calendar does not read the month to the screen reader 


* July 2014 


S 

M 

T 

W T 

F 

S 



1 

2 3 

4 

5 

6 

7 

3 

* □ 

11 

12 

13 

20 

14 

21 

15 

22 


18 

19 




Arlington Farmers 


27 

23 

29 

Market 




The information for each day is not read to screen reader 
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Footer: The users could not understand what the general phone number in the footer was for. 
According to the users, they prefer a "Contact Us" link. Additionally, when you click on the 
phone number link, you are redirected here: http://dev6.netvip.com/ArlingtonMA6/town- 
governance 


Another finding is that for screen reader users between each item in the footer, the user reads 
"Bullet." In order to ensure accessibility for all users, replace those images with "null" 
alternative text so they are not identified as text element. 


Hom& ■ Privacy ancJOnime Poliaes > 7S1-316-3000 Bids/RFPs ■ Employment ■ Technical Issuas/Submission Guidelines * 
Site Map 


Website Created by Vision Internet - The Innovators ot Online Government 




Apply fora Job 


ArlingtonMA6/departments/human-resources/employment-opportunities 


Human Resources 
► Employment Opportunities 

For Employees 


ts » Human Resources 

Employment Opportunities 


| Share & Bookmark [+] Feedback 


(All Departments) ▼ (All Job Types) 


1 JOB 

TYPE 

APPLICATION 

DEADLINE 

SALARY 

■_ I 

Fire. Police and Custodial Civil Service 

Information 

Full Time 

Open Until Filled 

Not Specified 

Grounds Maintenance Worker 

Full Time 

07/14/2014 

16.48 - 20.07 hourly 

Manaaement Analyst-Town Manaaets Office 

Full Time 

07/22/2014 

$51,712-$66,913 

Parkina Control Officer 

Part 

Time 

07/23/2014 

$16.48 - 20.07 

Water Systems Maintenance Craftsmen 

Full Time 

07/23/2014 

$20.49 - $24.94 per 
hour 


In general, the users found the "Apply for a Job" page easily. They were able to access the 
content of the whole page using a keyboard-only. One challenge was it was difficult to find the 
employment application from the "Job Offer" page. Ideally, add a link on the "Job Offer" page 
to the employment application. 
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Employment application : In order to ensure accessibility make sure the employment 
application is an accessible PDF, accessible Word document or a web form. The employment 
application document is readable, but cannot be filled by someone with low vision or no vision. 
Additionally, the user users could not identify where they needed to email the application. 
Users with low or no vision said they usually prefer to use an accessible online form rather than 
having to download, fill and then email a document 



Users said that their preferred way to apply for a job would be to have access to an online form on the 
website. If it is decided to not have an online application, we recommend providing information on the 
steps to take to apply for one of the listed job. 
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Pay a Bill 

ArlingtonMA6/departments/treasurer/online-bill-pay 



In general, users were confused by the remarkably different layout of the webpage and 
expressed how sensitive they are when they need to make a payment online. They want to be 
sure they are on the correct webpage. 


Use Tab Index to reorder the elements on this page to make sure they are read in the right 
order. When using the keyboard or a screen reader you will get to the "Account" field then 
arrive on the "Lookup" button before knowing there are Radio Buttons to fill in. Move the 
Radio button Above the "Account" field or on the left of the "account" field. 


The gray menu on the top of the page was not readable for the user with low vision. This issue 
has been resolved now by the use of Iframe. 
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The contrast is low and the title appears "blurry" when the screen is magnified. 


Users were confused about why the big "Google" image appears on this page 


Currently the "pay a bill" link goes to this page: 



Change of Address form: This form is not accessible. Ensure accessibility by opting for a fillable 
PDF online form or Word document. 

A user navigating with a screen reader will have every single "_" character read to him as 
"underline" never use characters for graphic formatting. 



HEAL ESTATI/W ATER 

nUWEdF UMMSE W OR DV^ER FORM 
IHinmnqinttiMi—nHlfW W »l«wtipnH 


1 OUOnracn>| iPrnli 

2 Fhqralv AiUmb 

(htaflL_ 

3>. Bill y*rthci\i\ 


4 Muw Owncila-i i Fril 

i Hiilfie aTQu-ran^ 

■ I' MU 

7 tiWcnr&ik_ 


Office nf die Tu L -Hlcelra 

To Bra m 
Arknirlit, fcCA BMW 
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Apply for a Permit Form 

http://dev6.netvip.com/ArlingtonMA6/departments/clerks-office/clerk-forms 

This form is completely inaccessible and cannot be read or filled out by someone using a screen 

reader. Make sure to use tillable PDF online forms and Word documents. 



Calendar 

ArlingtonMA6/communications-center/calendar 

In order to help bring clarity to the different calendars, one suggestion is to have three buttons 
(community/meetings/all events) be included on the main calendar. It is important to note the 
user had trouble understanding the vocabulary within the calendar. Review the items in the 
dropdown to make them more obvious to users using simple words and phrases such as "Arts 
Event," or "Farmers Market." Some terms are hard to understand for users not familiar with the 
town organization, for instance, "open space comm." 
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Dropdown menu: To help with accessibility, it is recommended to keep a dropdown menu list 
down to a maximum of 12 items. In order to narrow down the events, perhaps use two 
dropdown menus instead of one. 


Open Space Comm. 




(All Categories) 

5 Year Planning Committee 
Arlington Bicycle Advisory Committee 
Board of Health 
Board of Selectmen 
Building Maintenance Comm 
Cemetery Comm. 

Community 

Conservation Commission 
Election 

Electronic Voting Study Committee 
Finance Committee 
Historic Districts Commission 
Master Plan Advisory Committee 
Meetings - All Committees 


Open Space Comm. 


Park & Recreation Committee 
Permanent Town Building Committee (PTBC) 
Recycling Committee 
Redeve I op merit Board 


1 


The distance between the "Date""Location" and the info make it hard to read, maybe justify all the text 
left to ease the legibility. 

Communications Center 

Calendar 

Font Size: Q Q Q Share & Bookmark [+] Feedback Print 


Moonlight Beach Party @ the Res 

Date: 07/26/2014 7:00 PM -11:00 PM 

Location: Reservoir Beach 

Lowell Street 
Arlington. Massachusetts 


@) Add to mv Calendar 

Join us on Saturday, July 26 (7-11 pm) for a fun-filled Adu/f evening of music, dancing, food, drink, live auction and raffles. Learn more about this special nioht 
under the stars. . . 

Return to full list» 
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Where to Vote 


ArlingtonMA6/town-governance/elections/polling-locations 


// t'/qyffl? 

Arlington 



Services Commu-nlcatwiris Cwiter 


Fid-ctforis £ Vminjj 
CaJerda* 

Poling Lcjcatinra 
2flll Flocho-i RmuHi 
w 20II Eldcbon Rtsuha 
Tflll ris-::mn Rhsi.1I =, 
2010 Flncfon Resuhs 
20 GS Election P.«sulr: 
200S Fldclon Resells 
2007 Eldctioii R: : uH : 
200E- Flnnl an Results 
2005 FlBcbtm Results 
2004 Election Results 
SDK E Iflctign Repute 
2002 Election R; :-uh 
2001 £i?d»n R&sote 
200C ElHcbcn Results 


Elections & Voting 

□ B □ 


2 IH 4 Elecitcm mromadoti 

Tte LfliOtlB dTWomon YOHrfS ertll»flMnng ndsg to 111 pdltt tjm 9 am to 3 
p t on DlDctiorid^TomakD airiigHnanls. -please cal prcotTa :• t rlian dav 
7I144HH2 

201J WdJiTtiwd Heehfia DeiUon Cateoaai 

teSgmH>gatel tpclisaflor. 



-C-Smpipjei f Itidrior flapolls tlelew 


Events EEH 

Suit Priiiun i' 

BMraotn* 

Stine Eteciraft 

VUMjatH 


Contact 

Clerh 


0 

0 

0 

m 

a 

2 

a 


cHinp.nsrBHidjiTOU 

oanaunr#r>3ar2014 



iutefl>msyua.2<?u 
maftwitaoif rPtannat 20 u 


We found that none of the users could find the information about polling location on the left- 
hand menu. Most users were not familiar with the term "Polling Location" and would prefer 
something like "Where to Vote." 

Another finding is the link to download the "Voter Registration" is broken. Also, naming the link 
"Here" is not accessible because the user could not identify the link within the content when 
pulling out a list of links for the page. 


There is no accessible way to determine where to vote since you have to know what your Ward 
is and the map is inaccessible. 

The menu for "Past Election Results" is very long and extensive and the users have to go 
through this before accessing the main content. It could be reduced by using a link with the 
results from 2013 to 2000. One easy solution would be to move link from 2012 to 2000 in a sub 
navigation folder named "2013-2000" 


www.HumanCenteredDesign.org • 200 Portland Street, Boston MA USA • 617.695-1225 v/tty • 617.482.8099 fax 














Town of Arlington - Website Review Report 


page 29 


None of the users (with or without vision) were able to navigate the map comfortably and could 
not locate their ward. One user commented, "This map is not intuitive for me." While another 
user said, "If it was like a real map - Like a Google Map." 



The map was hard to navigate for all users and it is conveying information by color only. Above 
is an example of how the map would look like for users with Achromatopsy. 


KWcome to 

Arlington 

./ KUz&sacAii&etts 


a 

1 Want to... Town Governance 

Departments 

Services Communications Center 


Election* l Voting 

Calendar 

> foiling Locations 

2013 Election Results 
* 2012 Election Result* 


Polling Locations 


OB O I MM* WF«K« *1 


in we pot] 


2011 Election Results 
2010 Election Results 
2009 Election Results 


2006 Election Results 
2005 Election Results 
2004 Election Results 
2003 Election Results 
2002 Election Results 
2001 Election Results 
2000 Election Results 



We recommend using a street locator, like the type used for on the Arlington Public School 
Website, which was tested and worked well with users: 

http://www.arlington.kl2.ma.us/administration/schoolregistration/schoollocator.asp 


Begin typing Street Name and Number, then choose from the 
list. 

Street Name: ACORN PK Q 

Street Number: 15 O Unit: no units 0 

Elementary School District 

(Hardy 
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Public Works 


http://dev6.netvip.com/ArlingtonMA6/departments/public-works 



M Omelwy 



Public Works 


News 



Contact 



MimnmiKHi 

TN» <* PU04K went fDPWl 


Water/Sewer 

Billing 

Changes 


The Alt text on the banner image does not describe the picture. It appears the title of the image 
is what the correct alternate text should be. 


The Alt text does not match the image/function. It should say "Click here for details about 
Water/Sewer billing changes January 1, 2014." 


Water/Sewer 
Billing 
Changes 
January 1, 2014 

Click Itn ilttJli 

a _, 

- W.IT^i^OwPi Fli line 'i 
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Some users found it difficult finding information about Mass Ave. construction. Users did not 
see the "projects around Arlington" link immediately. It appears users are focusing on the main 
content rather than the left-hand menu. Therefore, users are likely to miss a lot of information. 
When looking for the latest update for Mass Ave works, user looked at the "project around 
Arlington main page," but that information is not as up-to-date as the info under "Mass Ave 
rebuild." 

For easier navigation make the subtitle "Street & Roads project," "Water & Sewer Projects" a 
header level 2 


Puhlir Unit' 

DPW him ft IWti 
' Rn.yc.hiij Tillth tiifrin-1il*j 


Projects Around Arlington 



Onw h Tw» 

5m*hr if iWntai ftSwiBWfi lfURiif;»1Iic*ratitid 


■Ttnfri Sjtf TI?^I ftp ^ 
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Application > Dog license 

ArlingtonMA6/services/applications-regulations-permits 


liWtjywr fu 

Arlington 

. fJa&sacAa&etts 

r 

ssfeLtt... mu 

1 Want to.Tow Governance 

Departments Services Communications Center 


Dog Owners h ip i n Arl i ngton 


h hF Ssrwip-Tl Klin. 
hMiini U kalKd JilnjKir =n 



■ li»i ocg xb* K ii jlPPta ar 
l« iMtilit dThfmrtiP 

ftfrjAdlli iVUUu cn Uj| Jl Sail ti±/Tf hai !Md ilitjiUlll x A 

Fij"4aml»aam>lHlrti! imn/xfj dh«j itaManibiftund nwa 


M ii iKhdwintx 
-,n.nw.!?)h 

■ifl rmuau Film 


TTm T llBt'hWit^MLittfl iVW lAftV 

r*Tl*T* w*l*Wtr(TwnBpt Tifl Tj—1 ^Ailni^tFl ■V**Efcn ETj^ltrn rhpjj^Tvirl 
P-K bji'i 1 ! i'll Alii m* iii< IdtW ui| it*u r ij Otnidt UulHBr Jlfc «u h Hi 

DLHA Wtti turi'g otfc» Ttarr<HtOUli,tta Fai.Cim^njmmn Vkruumurtaiti tans ri Mipitla 
Pur Jill TtaircMs Fnld t:m I * m In F i -n qpg<;GiR>.iuKi xirl rapiUHiK |]|||. 


W.m FwIa rp <lrw. I'rfl l*nh ir If.it, rr Imr^rjhl 

i'tih Fish > 3 ratun l>j t* i* niipni>jiu mha (X+j sidOiMi jii jiuiu on il- n»jim .jnavini a 

sotLiii mms ie is iImuyia ihTiu aiwtapiica anstads -a>i aptin rfpi <XR* n fwnpli ibCivoi tsini 

mi Mill, u .1 CDMl Frtlfl d'ft'in Allis UU U«lHMi Mm dri atuc «Ml rill ■. h m 1 mm* iiii 
PWdcg ni4Hih 


iioirtrl 

iwirlaiiiiiui 


iri^ anlni uas i|KKliiO*< 


Our review found no useful information about Dog License information when clicking on the 



Another finding from our review found the sample dog license to be completely inaccessible, 
the "was this helpful" function on the page above is not accessible for User using screen reader 
only. 


Additionally, the actual dog license form was very difficult to find (it is not under the 
"Applications, Regulations & Permits" link but under clerk's office > Clerk form). 
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Police Department 


ArlingtonMA6/departments/police-department 



Pindars 

Tsiwmam AwBreoBBS 
Animal Cmlrcil 


Police Department 


□ DO ■ Wr«- A 


- Afcout APD 
Goniacl 


News 


APO tPbcl INin T(A VdIui^vt Hto (fee 

Tj 7 ,?tn 1 HQdfH 

Arllnffinn Police Ham REi*denrt or Pamg Srami 

TJttSfiia 1 BfcKPW 


A PC Focua mi BfcyEfc and PednlriMi £*1 ±f, 

in rcMnl r«li Hit ftrintfnr. R*a hivt b*M handag Ml airwiTaten an tie ml» nr Uia 
mad tn Utyctai and ^edesriarrs u pul ai an cnpanp efl-^ctonn (iairif m nab car 
rtads tiltr Ibr al trarelera 
TWIBU IftU-JS W 


The mlasioti iH Bib Adlhtftan PoPre Departmervl id b> prnmoln, presarvE and 
KIMr quililr Series 43411 Id dlMui* the tdfdlf df dll rlleniBtrs df dur 


Contact EBB 



Arlington 
Alerts (§) 

Register Here 

JlilSRED 


TWlSsrFMd 

' ht.1-,-nnr 11 Jiiji_ 


The Alt text on the banner is incorrect. It reads "Police-2604""Police-2608," which does not 


accurately describe what the picture is. 


Additionally, the Alt text on "Arlington Alert" button is not accurate. It should say something 
like "Register here to receive time-sensitive notification for Arlington by phone text or email." 
This issue has been addressed prior launch. 
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Sign up for Alert 

http://cne.coderedweb.com/Default.aspx?groupid=510b8x%2fpD%2bUmdNxkp8aU4Q%3d% 

3d 


Keeping citizens informed. 



Already have an account? Login 

Arlington^ 


Town of Arlington, MA 


Please take a moment to fill in the appropnate 

information below to be notified by the Town of provide 2 I verify ( 3 . submit 

Arlington m emergency situations or of cnbcal 
community alerts. 


Location Details "required fields 

- Address to be monitored Apt/Suite/Unit 

;•«**« ns P.o. ksxM t_ ) ^ _ ) 

* city * Th,s address ' s • residential business 

_ " State MA » ~ Zip Code 02143 _ 

_ 1 s address a mobile 0 ^ m j t . * ' ' _ K 


* Name 

fint me laic or buimsii 


Emaii 


* Phone 1 


Phone 2 


Mobile 

J TDO/TTY device 
Ton* d»li*«r> , hr hearing >mpa<f*<s 


- Mobile 

- TOO/TTY device 

T«ne delivery, lor hearing impaired 



Emergency Notifications 


* General Notifications 


Another finding in our review is inaccurate labeling on the checkbox that appear as "Is this 
address a mobile or manufactured home" for the screenreader User it read "contact checkbox." 


The content provided for the "continue button" to someone using a Screen reader is 
"CtlOO$content$btncontinuebuttononmouseover" 



Image buttons provide important functionality that must be presented in alternative text. 
Without alternative text, the function of an image button is not made available to screen 
reader users or when images are disabled or unavailable. 
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Arlington Visual Budget 


Page : http://dev6.netvip.com/ArlingtonMA6/town-governance/financial-budget-information 


Image button with no adequate alt text 



Town Budget, Visualized 


<img style =1 'f loat: Eight; horde r—width: Opjc; border- 
style: solid; margin-top: lpxy 
" alt= 1 , A^ T B_LogoSquare " s ec= ,r / Ar 1 ingt 011 MA 6 
/Home / Show I mage ? id=3 1 €fit=€3 523 66E S3 97170000" > 


Arlington, MA 

Town Budget, Visualized Revenues Expenses Funds & Reserves 

iSearch 


See your town's budget. 

Government budgets can be tough to 
understand, but now the Town of Arlington, 
Massachusetts is providing the next generation 
of accessibility in financial information that 
allows citizens to view, engage with, and 
discuss. 

Arlington residents, see where your tax dollars 

go: 

Your property tax last year: $ 2000 Start 


Start learning about Arlington: 

What is the annual cost of the Fire Department? 

How much money does the Town spend on 

schools? 

How expensive is Snow & Ice Removal? 

Start the tour or Dive in 


:: Map view ■= Tabular view 2014 


Revenues Expenses 


Funds 


$133 M ■ $133 M ■ $23 M 



The links on this page http://www.arlingtonvisualbudget.org/ were not accessible for users using 
keyboard only. But this is probably a third party website on which the town of Arlington has little 
control. 
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News 

ArlingtonMA6/communications-center/news 


■‘lellfWTO Hrcivflkiei Tth Annual Golf Tournament 

7 ,h Annua] The Arlington Recreatrpn Department is proud to announce its 7th Annual Gotf Tournament on 

G0LF Friday; September 12.201* 



Master Plan Historic and Cultural Resource Areas f.lay 1 

The Historical * Cultural Resource Areas. Working Paper is enlme andttae survey will Ue 
posted on May 2nd 

<Mto&.20T* T 7.-64 AM 

aetsit 

Users were able to access all the content easily in this section. 

The one issue that did come up on this page had to do with an image's alternative text. The alt. 
text repeats the link name when it should describe the picture. 

Contact Us 

ArlingtonMA6/departments/recreation/contact/-alpha-R 



We found the users were looking for a "Contact Us" link. There was no obvious location that 
lists the Town Hall hours of operation and provides a general phone number. Perhaps, the top 
of the Department page can include a main phone number, the Town Hall address, and hours of 
operation. 
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It is important to mention, there is a general phone number in the footer, but users could not 
understand what it was associated with on the webpage. When you click on the phone number 
link you are redirected to this page: http://dev6.netvip.com/ArlingtonMA6/town-governance 


We recommend having a "Contact Us" link under the "Communication Center" as well as under 
"I want to .." 

On the mobile version of the site, the "Contact Us" does not link to anything. 



tt* 

Arlington 

U4 u* Tndudhn 

a 

3 Wink i&u Tdwn Govern ante 

Departments Services 

1 


£m*i SueKr^&on Usls Nsiw-s HequestAr-gwer Oentar PYwacy B. OJne 

aiWjnty Phone Numbers Cifcnder ^ 


■■ n=— w—* * 


Bid RFP's List 

http://dev6.netvip.com/ArlingtonMA6/services/advanced-components/rfp-posts-list 


We got to this page using a link in the footer; however, there does not seem to be any 
correlation between that page and the left-hand side menu. Also, it was hard to understand 
what "Advanced Opponent" stands for. 


yf Wcom? to 

Arlington 

Jua&sac/ui&ett& 

F 

p« 

select Language ▼ 

mered by Gq yk Translate 

Search... ^ 

■ 

1 Want to... Town Governance Departments 

Services 

W1L 

Communications Center 


Services » Advanced Components 



Applications. Regulations & 
Permits 


RFP Posts List 


^ Community Links 

▼ Event Facilities for Rent 

Prescription Discount Drug Card 
Program 

Request/Answer Center 


Font Size QQ Q Share & Bookmark [+] Feedback Jfc Print 


(All Departments) Q (All Bids) 


1 NUMBER 

TITLE 

STARTING 

CLOSING 

STATUS 1 


14-02 

14-02 Peirce School Chiller Proied 

01/30/2014 4:31 PM 


Open 

13-42 

Bill Printina and Mailina Services 

01/10/2014 11:00 AM 


Open 

13-46 

Snow Removal & Hauling 

01/09/2014 10:00 AM 


Open 
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Request/Answer Center 


ArlingtonMA6/services/request-answer-center 



» Event Facilities for Rent 

Prescnption Discount Drug Cart 
Program 


► Request/Artswer Center 



est/Answer Center « 


Unknown login or invalid password 



The error message above was hard to find when using a screen reader. 

Another recommendation for this page is to use CSS to organize the page instead of a table. The 
table made navigation very challenging. 

Additionally, try to avoid links that do not make sense out of context: 

For complete rules and regulations regarding parking in Arlington please go here . 


The use of a frame makes the navigation difficult. You only see a part of the screen, but there is 
no scrolling bar to navigate within the screen. 


* Community Links 


Request/Answer Center 


* Event Facilities foi Rent 

Prescnption Discount Drug Card 
Program 

> Request/Answer Center 



lew lev Account i Update Mv Contact IntormaMon i logout 

ind answers to commonly asked questions by Depl/Category Description or Keyword Search 
lept.rCategocy Animal Control » Keyword Search: 

Ascription: All Hems •» 


*1 2 2 4 5 8>l Displaying Page 1 of 6 

r Description Dept . 1 

t ffliat Bfgfluas an Kfisttired naartova *«» ana wfitn anfl haw an! <3>$ s>qsi af Bum? Recyc 

> What are the rutes tor parking in Arlington? Parlor 

j wnamai is my trash ana renana Recyc 

t ww ■? wot wwfl tart waste and rtw 1 9 n Mi|gfl»<r Recyc 
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Another important finding is the contrast on buttons. It is very low making it difficult for the 
user with low vision to read. 

Post Launch Evaluation: 

Services 

Request/Answer Center 

Font Size QQ Q Share & Bookmark [+] Feedback Print 



GbvQ\ 


The website has been updated with a Frame and the information from the Answer/Request Center is 
now blended in the website. This makes the navigation easier for users with cognitive impairments and 
low vision users. However, we noticed that the frame used is creating issues with some of the screen 
reader technologies. When using NVDA screen reader it seems to work correctly, but when navigating 
using JAWS screen reader, the links on the page are not read. 

Since this section of the website was developed after IHCD evaluation, an in-depth evaluation of this 
would require the involvement of User/Experts and consist in an additional scope of work. 

A possibility is that the incompatibility with JAWS screen reader is coming from the JavaScript used. 
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School Department 

http://www.arlington.kl2.ma.us/home/ 


Select Language ▼ Powered by Googkr Translate 



Arlington Public Schools 

869 Massachusetts Avenue Arlington. Massachusetts 02476 


Facilities Help Desk 
Technology Help Desk 52 


District Information 

GjAdministrative staff 

0AHS Facilities Information 

• Budget Information 

• Calendar 2014-2015 

• Community Education 

• Creating Safe Schools 

• Departments 

• District Goals 2014-2015 

• Overarching Goals 

• District Maps 

• District Policies 

• English Language Learners 

• Food Services 

• Health & Nursing Services 

• Health & Wellness 

• Human Resources 

• Kindergarten Information 

• Inclement Weather Policy 

• MCAS 

• METCO 

• News | News Archives 

• Payroll Department 

• Redistricting Information 

• School Committee 

• School Registration 

• School Report Cards 

• Special Education 


NEWS 

^ Superintendent's Newsletter - June 2014 
^ District Goals 2014-2015- Approved June 12.2014 
Uj School Calendar 2014-2015 - Approved June 12.2014 
Submit school news to: schoolnews@arlington.k12.ma.us 
EVENTS / FORUMS / MEETINGS 

2 Updated 7/14/2014 

Q\HS One-Week Driver Ed Class - July 14-18 

Finish all classroom instruction in one week. Schedule on-road 
instruction at your convenience. 

d\HS Travel to Italy - April 2015 Vacation 
ANNOUNCEMENTS 

7 Updated 7/14/2014 
• 2014 SUMMER READING LISTS 
•Arlington Summerfun 2014 

Creative & Enriching learning adventures. Students entering Gr 1-9. 



LOG-IN: STAFF E-MAIL 


LOG-IN: AESOP 


SCHOOL 

REGISTRATION 

■ ; 

SCHOOL LOCATOR 

CLICK HERE TO 
LOOKUP YOUR ADDRESS 



SIGN-UP FOR PARENT NOTICES 
NEW STAFF ACCOUNT REQUESTS 

STAFF AUP ONLINE SUBMISSION 


• 5-2-1 Programs at Ottoson Middle School 

• College Acceptance and Matriculation - Class of 2014 

• 2013 Youth Risk Behavior Survey Results - Ottoson 



Key findings in this section include the following: 

• Very busy layout; 

• The buttons on the right side of the page are hard to read; 

• PDF documents are not accessible; 

• The color coding does not seem to make sense; 

• There is no "Heading" on this page; 

• A lot of images are used for decoration (e.g., Bullets) and a lot of spacer images; 
decorative image should have null="" alt text; and 

• The banner image does not have alternative text. 
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My Rec 



Key findings and suggestions: 

• Alternative text is missing on pretty much all pictures; and 

• Empty link in the menu. 

• Inconsistent Heading structure 

• Bad contrast and hard to read font 
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Calendar 



Users found the calendar on this website easily, although the calendar was not accessible for 
the users with a vision impairment or no vision at all. The screen reader reads all the events 
across horizontally without reading the day in which the events were happening. Our 
recommendation is to replace the calendar with an accessible table that includes a label for 
columns and headers similar to the calendar type on the main Arlington website. 


Another suggestion is to avoid pop-up windows. They have a tendency to look like broken links 
for screen readers and for those using screen magnification they do not see that another 
window has opened up. 


In addition, this page does not have a title. Our recommendation would be to add a title such as 
"Arlington Recreation Calendar." 
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Create an Account 



Fjix ilitii”. 

Prietos I Into 

News 

Help 


How to Register 
lown Her Site 
CtmluCl 


Create an Atc«jnt 






Account Type: 

* Household Organization 

Account Name: 

Prim-ary Phoner 

EXL 

TVtm: 

family faS 



- Selod - T 



h 


We discovered the video link is broken. When the user clicks on it, nothing happens. Also, add 
the correct captioning to the video because the current captioning is not accurate. According to 
the users, the video tutorial is too long. A recommended time for videos is between one and 
two minutes 
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Arlington Massachusetts-Website Graphic Evaluation 



Contrast Issues with Text 

The WCAG 2.0. Requirement's 1.4.3 Contrast (Minimum) (Level AA) 

http://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast. html#larger- 

scaledef 

Text and images of text need to have a contrast ratio of at least 4.5:1. 

Large text (over 18 point or 14 point bold) has a contrast ratio of at least 3:1 
Use the Contrast Analyser - Application to adjust to the right contrast. 


Examples of Text where the contrast is too low: 



Redevelopment Board Meeting 


Contrast ratio: 2.53:1 

□ Short/Full 

Text 


Large text 

X 

Fail(AA) 

X Fail(AA) 

X 

Fail(AAA) 

X Fail(AAA) 


www.HumanCenteredDesign.org • 200 Portland Street, Boston MA USA • 617.695-1225 v/tty • 617.482.8099 fax 




















Town of Arlington - Website Review Report 


page 45 


1 Finance Committee 

Contrast ratio: 2.15:1 

Text 

□ Short/Full 

Large text 

X - 

X Fail(AA) 

li 

X FaiKAAA: 

X Fail(AAA) 

Contrast ratio: 3.81:1 

□ Short/Full 

Text 


Large text 

Meeting and Special Town * 

Fail(AA) 

✓ Pass(AA) 

X 

Fail(AAA) 

X Fail(AAA) 


Contrast ratio: 1.55:1 □ Short / Full 



Text Large text 

1 E3 



X 


mam 

* 


X 


Contrast ratio: 2.64:1 


□ Short/Full 


Contrast ratio: 2.71:1 


□ Short/Full 



Text 

Large text 

Text Large text 

This is a slide title 

X 

Fail(AA) 

X 

Fail(AA) 

X 

Fail(AA) 

X Fail(AA) 

I This is a slide description 

X 

Fail(AM) 

X 

Fail(AAA) 

X 

Fail(AAA) 

X Fail(AAA) 


Examples of text where the contrast is good: 


More Meetings » 


Contrast ratio: 13.41:1 
Text 


✓ 

✓ 


Pass(AA) 

Pass(AM) 


□ Short/Full 


Large text 

✓ 

Pass(AA) 

✓ 

Pass(AAA) 


Contrast ratio: 12.56:1 
Text 

Metilrtg Warrant for Annual ✓ Pass ( M > 

✓ Pass(AAA) 


□ Short/Full 
Large text 


✓ Pass(AA) 

✓ Pass(AAA) 


The text below is okay contrast for large text but it would be recommended to make the 
background lighter or the font darker: 


All Events 


Contrast ratio: 4.38:1 
Text 

X 

X Fail (AAA) 


□ Short/Full 
Large text 

✓ Pass(AA) 
X Fail(AAA) 
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Additional Contrast Issues 

Navigation : This contrast is okay for large text, but it would be recommended to make the 
background slightly darker. 


I Want to... 

Services 

Communications Center 


Icons menu : For user with low vision the small text and low contrast will also affect the 
readability of the text. 



Important Updates : The contrast is too low for small text, especially in this context where the 
update should be the first thing the user notices on the page. Using a stronger contrast is 
recommended. 



Nulla vestibu lum vrverra odlo a fedllsis, Fusee non feud bus 


Contrast ratio: 4.08:1 
Text 


x 

X 


Fail{AA) 
Fail (AM) 


O Short/ Full 


Large text 

✓ 

Pass(AA) | 

X 

Fail(AAA) | 


. Mcntn matesuada scelenlsque nulla. Curabitur hendredt 
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TOWN LAUNCHES NEW WEBSITE 


KWmmr to 


Select Larfrjaae - 1 

(flu 

Arlington 

Jk£a&mcAu&et£& 


POTw*d hy Translate 

m 

1 Want to... Town Governance 

Departments 

Services Communications Center 


Planning & Community 
Development 

Sign Permits 

Master Plan 

Community Development 
Regulations & Applications 
Fair and Affordable Housing 
T Economic Deveippmenl 
Contact 
Projects 
Contact 



Planning & Community Development 


Fori Size Q El O n [+] Fsedback A 


News 


Events EHTfl 


MalarPldn Historic and Cultural Rniourn Anris Hay 1 Rodcviflnpmur,t Board Mauling 

Tho HrataroriS GuHunil RsanureB Arnrn Wtarlrng PSipqr h hi Ira and Sib turvay w*E» 06116® 14 7 00 PM - 0 IB PM 


TlTWflOAM 


R<jdnv»ln pm wit fl-oard Mwiling 

07*7® 14 7 W PM 



Discern the public interest and direct compatible land development ami 
redevelopment Anticipate needs and preplans that development, or papulation 
change, c r change in economic conditions may firing, and determine methods to 
meel me “Red?. _ 


Contact CSB 


Community Dmvtapmant 
19; tM Uih Av*. Annex 
Arlington. MA 02476. 

Q £701 >3111-3091] 

awhlita n^hwi'i.ifl ;n(n*i.ma. j 


The Department of planning and Community Development provides staff support 
to the Arlington Redevelopment Board or ARB. The ARB is *w Town's Planning 
Boeid end is also a retfeveropment authority, The Department Director is 
appointed by and reports to me Town Manager, 

A list of Town amt local organkatlonfi the Planniift Cmpartmuitt wojt f WM^ 
pstapndRw fich- L fri ft* 


The contrast highlighted in red boxes above is not strong enough. See test results below. 


0Q Q [+J Feedback 


4> 


Contrast ratio: 2.84:1 O Short/Full 


Text 


Large text 

X 

Fail(AA) 

X 

Fail(AA) 

X 

Fail(AAA) 

X 

Fail(AAA) 


OrginteJTlHi 

The Depa tremor Flan n-ng and Commijisily Development provides slair support 
to flie Arlington Redevelopment Boart or ARB, T&ve AUB isfi* Tpwrifi Panning 
Board and is also a rMevelopment authority. The Depanmanl Director is 
appfl«i»d by and repo«» To the Town Manager 


Contrast ratio: 3.18:1 OShort/Full 


Text Large text 

X 

Fail(AA) 

✓ 

Pass(AA) 

X 

Fail(AAA) 

X 

Fail(AAA) 


Contact na 

□ Short/Full 
Large text 

✓ Pass(AA) 
X Fail(AAA) 


Contrast ratio: 2.59:1 □Short/Full 




Text 

X 

Large text 

X Fail(AA) 



X FaiKAAA) 

X Fail(AAA) 


(Tin laialaa 1 
r J AiMirv HA 42 


Contrast ratio: 3.7:1 
Text 

X 
X 


Fail(AA) 


Fail(AAA) 
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The contrast in the menu is a good contrast: 


Polle* Department 

toewa & Notices 
T Traffl ^Parking 
Sew Offenders 
Firearm* 


Records 
Tean Rraouftas 

AeJmaJ Ccntrot Contrast ratio: 6.64:1 □Short/Full 


About AFO 

Text 


Large text 


✓ 

Pass(M) 

✓ Pass(AA) 

ContiKl 

X 

Fail(AAA) 

✓ Pass(AAA) 


Background Issues 

Using a picture background behind the text can make text harder to read. In the case of the title 
it is probably not an issue but for smaller elements it might confuse the users. 


This is probably fine: 

if Wwme to 

Arlington 

jffa&sac/u&sctts 


These will be harder, and not recommended for a menu items: 



Color Blindness Color Choice 

Below is a view of how the page would look for a user with color blindness type Deuteranopia. Once the 
color contrast issues noted above have been addressed this should be easier to read. 
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Other Issues - Calendar 


A few small changes could be made on the calendar page that would make it easier to 
understand for individuals with cognitive issues. 

Changing the time from the 24-hour clock (military time) to the more common use of 
standard time. The use of military time forces many individuals to recalculate the time in 
their head. 

The large number for the day with the tiny month below might be confusing. Adding to 
the confusion is the calendar at the right showing a different month. 

Showing the full name for the month of June and only abbreviating the longer might also 
be helpful. 


Meetings 


Community 


02 

Jun 

02 

Jun 

03 

Jun 

03 

Jun 

04 


FtMnes Comm 
IBiMPM 


All Events 

Hay 201* 



u 11 H » II If 

it a it n n u 

M .17 21 39 H It 
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Conclusion 

By addressing the key findings identified earlier, much progress can be made to ensure the 
accessibility of the ArlingtonMA.gov website. It is important for the ArlingtonMA.gov website 
team to continue to include older users with disabilities across the spectrum of skill and 
technology ability for ongoing testing and evaluation of the website. Furthermore, future online 
service application procurement processes should factor in accessibility to avoid the situation of 
linking city services to inaccessible external service providers. 


We appreciate the proactive and positive attitude of the Public Information Officer of Arlington 
toward Accessibility. A great number of the issues pointed to during the web evaluation where 
fixed prior launch or shortly after reception of the draft report. 

It is important to make sure that every person involved in the uploading of content pay the 
same attention to accessibility. We found that some portion of the content added after IHCD 
initial review of accessibility does not reflect the same quality in terms of accessibility. We 
suggest developing a reference guide for the staff to remind them of accessibility best 
practices. It is crucial to keep the content accessible and make sure that every image added will 
also have alternative text, and that proper use of headings is used throughout the website. 

Many actions have already been taken to improve the accessibility of ArlingtonMA.gov, mostly 
focusing on the needs of Users with no vision, this is a great step forward. We would like to also 
stress the importance of the contrast issues that are very important for Users with low vision; 
the recommendations concerning the graphic evaluation have not been addressed yet. 


The ArlingtonRecMa.gov has some work to do be as accessible and welcoming to everyone as 
the Town clearly wants to be. 
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Resources 

Guidelines 

Section 508 Standards http://www.access-board.gov/sec508/standards.htm 
World Wide Web Consortium, Web Accessibility Initiative http://www.w3.org/WAI/ 

Groups 

Web Accessibility in Mind (Web AIM) www.webaim.org 
Assistive Technology Industry Association http://www.atia.org 

Captioning and Transcripts and Video Remote Interpreting 

Captions and Transcription Services 

http://www.uiaccess.com/transcripts/transcript services.html 

Open Source Subtitling Tool http://www.universalsubtitles.org/en/ 

Purple Video Remote Interpreting http://www.purple.us/ 

Audio Description of Visual Information 

Web AIM http://webaim.org/techniques/word/ 

University of Wisconsin at Madison http://www.doit.wisc.edu/accessibilitv/online- 
course/index.htm 

University of Washington, Accessible Multimedia Brochure 

http://www.washington.edu/doit/Brochures/Technology/vid sensory.html 

Multi-media Access Generator (MAGpie) 

http://ncam.wgbh.org/invent build/web multimedia/tools-guidelines/magpie 

Audio Description http://www.astc.org/resource/access/medad.htm 
Guidelines for Visual Descriptions: 

http://www.csun.edu/cod/conf/2001/proceedings/0031alonzo.htm 


www.HumanCenteredDesign.org • 200 Portland Street, Boston MA USA • 617.695-1225 v/tty • 617.482.8099 fax 


















Town of Arlington - Website Review Report 


page 52 


Tools 

WAVE Accessibility Evaluator http://wave.webaim.org/ 

Open Source Screen Reader http://www.nvda-proiect.org/ 

JAWS Screen Reader http://www.freedomscientific.com/products/fs/iaws-product-page.asp 
Lynx Viewer (View Website in Text Only Format) http://www.delorie.com/web/lynxview.html 

Applications 

JW Media Player http://www.washington.edu/accessit/articlesP1251 

YouTube with an "Accessible Skin" http://icant.co.uk/easy-youtube/docs/index.html 

Software and Service Providers 

Net Centric Technologies (PDF Conversions) www.CommonLook.com 
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